<template>
    <view class="page">
        <back-top v-if="showTop"></back-top>
        <view class="top-box bgwhite d-flex a-center">
            <view class="search flex-1 height bgF5 d-flex a-center">
                <text class="iconfont icon-search m-right10"></text>
                <input class="flex-1 size28" v-model="queryStr" placeholder="请输入字段名" confirm-type="search" @confirm="confirm" />
            </view>
            <text class="iconfont icon-zengjia size42 m-left30" @click="toUrl('/pages/form/editField?order_id=' + orderId)"></text>
        </view>
        <view class="list">
            <view class="item bgwhite d-flex a-center" v-for="(item,index) in list" :key="index">
                <view class="flex-1">
                    <text>{{ item.config_name }}</text>
                    <text class="m-left10 m-right10">-</text>
                    <text class="color_99">{{ item.typeName }}</text>
                 </view>
                <text class="iconfont icon-bianji size36" @click="toUrl('/pages/form/editField?order_id=' + orderId + '&id=' +item.id)" v-if="item.config_locking == 0"></text>
                <text class="iconfont icon-jianshao2 size36 m-left30" @click="handleDel(item)" v-if="item.config_locking == 0"></text>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                showTop: false,
                queryStr: '',
                orderId: '', // 表单id
                list: []
            }
        },
        onLoad(e) {
            if(e.order_id) this.orderId = e.order_id
        },
        onShow() {
            this.getList()
        },
        methods: {
            getList() {
                this.$http.post({
                    url: '/SRA_CustomerForm/getAppointmentFormItemList',
                    data: {
                        bid: uni.getStorageSync('bid'),
                        shop_id: uni.getStorageSync('store_id'),
                        orderId: this.orderId,
                        queryStr: this.queryStr
                    }
                }).then(res => {
                    if(res.code != 100) return this.$Toast(res.msg)
                    this.list = res.data || []
                })
            },
            handleDel(item) {
                this.$model('提示', '确定删除该配置项吗？').then(res => {
                    if(!res) return
                    this.$http.post({
                        url: '/SRA_CustomerForm/delAppointmentFormItem',
                        data: {
                            bid: uni.getStorageSync('bid'),
                            orderId: this.orderId,
                            id: item.id
                        }
                    }).then(res => {
                        this.$Toast(res.msg)
                        this.getList()
                    })
                })
            },
            confirm(e) {
                this.queryStr = e.detail.value
                this.getList()
            }
        },
        onPageScroll(e) {
            if(e.scrollTop > 520) {
                this.showTop = true
            }else {
                this.showTop = false
            }
        }
    }
</script>

<style lang="scss" scoped>
    .page {
        padding-top: 88rpx;
        view, text {
            font-size: 28rpx;
        }
    }
    .top-box {
        width: 100%;
        height: 88rpx;
        padding: 16rpx 30rpx;
        position: fixed;
        top: 0;
        z-index: 3;
        .search {
            border-radius: 56rpx;
            padding: 0 28rpx;
        }
    }
    .list {
        padding: $page-space;
        .item {
            border-radius: $border-radius-sm;
            padding: 24rpx $page-space;
            margin-bottom: $page-space;
            .iconfont {
                color: $uni-color-primary;
            }
        }
    }
</style>